Typical Web page documents are HTML documents, each of which is divided into head (HEAD) and body (BODY) sections. The head section provides document information, while the body section contains display content on a browser screen, including not only characters and images (where separator lines and borders are counted as images) but also information related to a style of the Web page (layout, character font, color, etc.).
Page Designer and Dreamweaver®, which are well-known as Web page authoring tools, provide an edit screen on which an HTML document can be displayed like a Web client's browser screen (hereinafter referred to as “browser-like edit screen”), as well as an edit screen for directly editing source code of the HTML document, so that an editor or author can edit the HTML document efficiently on the browser-like edit screen.
FIG. 20 shows a browser-like edit screen 711 in a conventional Web page authoring tool 710. A Web page document has default style values commonly applied to the Web page. In a Web page shown in FIG. 20, paragraphs 715, 716, and 717 are defined by the default style values, respectively. As for kinds of paragraphs, for example, a heading style is applied to paragraph 715, a normal style to paragraph 716, and a bullet list style to paragraph 717. The HTML document of the Web page displayed in the Web authoring tool 710 includes element names (tag names) in the body section to describe what kinds of styles are applied to the paragraphs 715, 716, and 717.
HTML can define in the body section a style of each view object appearing on a browser screen. There are two types of styles, direct and indirect. The direct style is a style whose existence is directly known from a document itself defining a view object to which the style is to be applied (see FIG. 13A to be described later). The indirect style is a style whose existence is known only after referring to an external document (e.g., CSS (Cascading Style Sheet)) described in a document defining a view object to which the style is to be applied (see FIG. 13B to be described later).
For example, suppose that there is such an indirect style as to set a text color of blue, a text color of green, and a background color of red for heading, normal, and bullet list paragraphs, respectively. In the browser-like edit screen 711 of the conventional Web page authoring tool 710, a direct style can be applied to a view object, but an indirect style cannot be applied, so that the browser-like edit screen 711 does not render the paragraphs 715, 716, and 717 with the text color of blue, text color of green, and background color of red, respectively.
A typical conventional Web page authoring tool has a preview screen to open a browser separately from the edit screen so that the author can see how the HTML document being edited is displayed in the browser. However, the preview screen is just to see the content of a Web page to be edited, and the author cannot edit the Web page to be edited on the preview screen.
Dreamweaver® as a well-known Web page authoring tool supports the back-end operation of an application server at the time of editing. In this case, since a JSP container is implemented in the server, an external document is processed using a custom tag or jsp:include tag. Therefore, a style set by the external file is reflected in the view object on the edit screen in such a manner that the edit screen shows the Web page document in a display state similar to that on an actual browser screen.
In the browser-like edit screen 711 of the conventional Web page authoring tool 710, the author may edit a document without knowing the existence of an indirect style for a view object of the document being edited, which would result in inappropriate editing.
Editing a Web page document with Dreamweaver® by activating the application server would result in heavy load, and could not edit a certain portion with a custom tag such as an if tag indicating part of child tags.